<template>
	<div class="box">
		<!-- 第一 -->
		<div  class="one">
		 <ul  class="one_a" > 
		  <li style="margin-left:120px"><img src="@/assets/images/logo.jpg"></li> 
					 
					<li style="margin-left:140px"><router-link to='/'>首页</router-link></li>
					 <li >|</li> 
					<li ><router-link to='/gy'>关于我们</router-link></li>
					 <li >|</li> 
					 <li ><router-link to='/jie'>解决方案</router-link></li>
					 
					 <li >|</li> 
					 <li ><router-link to='/jiShu'>技术服务</router-link></li> 
					 <li >|</li> 
					 <li><router-link to='/xw'>新闻中心</router-link></li>
					  <li>|</li>
					  <li><router-link to='/lx'>联系我们</router-link></li>
					 <li style="margin-left:120px"><img src="@/assets/images/tel.jpg" alt=""></li>
		 </ul> 
		</div> 
		<!-- 第二部分 -->
		<div class="two">
			<p style="font-weight: bold;font-size: 100px;">专业网站开发20年</p>
			<p >Focus on website developent for 20 years</p>
			<p >移动应用开发 微信平台开发 嵌入式开发 电子商务平台开发 ERP/CRM/EHR 美工设计</p>
		</div>
		<!-- 第三部分 -->
		<div class="three">
			<div class="three-top">
				<h1 >技术服务</h1>
				<h3><img src="@/assets/images/bg.png" alt="">TECHNICAL SERVICE<img src="@/assets/images/bg.png" alt=""></h3>
			</div>
			<div class="three-center">
				<div class="left"><img src="../assets/images/js_img1.jpg" alt=""></div>
				<div class="right" >
					<h1 style="font-size: 60px;color: deepskyblue;">移动应用开发</h1>
					<h3>iOS、Android、Windows Phone、Windows CE解决方案提供与开发</h3>
				</div>
			</div>
			<div class="three-center-1"  style="margin-top: 410px;">
				<div class="left">
					<h1 style="font-size: 60px;color: deepskyblue;">微信平台开发</h1>
					<h3>提供微信平台的高级定制开发，针对企业内部现有平台接口的对接与开发</h3>
				</div>
				<div class="right"><img src="../assets/images/js_img2.jpg" alt=""></div>
				
			</div>
			<div class="three-center-2"  style="margin-top: 810px;">
				<div class="left"><img src="../assets/images/js_img3.jpg" alt=""></div>
				<div class="right">
					<h1 style="font-size: 60px;color: deepskyblue;">嵌入式开发</h1>
					<h3>智能交通领域的软硬件通讯产品，蓝牙
					智能交通领域的软硬件通讯产品，蓝牙
					(BLE)/Wifi/USB/串口通讯等主流设备的开发

					</h3>
				</div>
			</div>
			<div class="three-center-3"  style="margin-top: 1210px;">
				<div class="left"><h1 style="font-size: 60px;color: deepskyblue;">电子商务平台开发</h1>
					<h3>B2B、B2C、C2C、B2B2C模式，集销售、支付(银联/支付宝/微信)、管理于一体的平台开发</h3></div>
				<div class="right"><img src="../assets/images/js_img4.jpg" alt=""></div>
			</div>
			<div class="three-center-4" style="margin-top: 1610px;">
				<div class="left"><img src="../assets/images/js_img5.jpg" alt=""></div>
				<div class="right"><h1 style="font-size: 60px;color: deepskyblue;">ERP/CRM/CMS/EHR</h1>
					<h3>企业应用领域的ERP、CRM、CMS、EHR平台开发(C/S、B/S架构)
</h3></div>
			</div>
			<div class="three-center-5" style="margin-top: 2010px;">
				<div class="left"><h1 style="font-size: 60px;color: deepskyblue;">美工设计</h1>
					<h3>APP UI、Web UI的交互设计及游戏原画的设计</h3></div>
				<div class="right"><img src="../assets/images/js_img6.jpg" alt=""></div>
			</div>
		</div>
		<!-- 第四部分 -->
		<div class="four">
			<div class="four-bott">
				<img src="../assets/images/ditu.jpg" alt="">
			</div>
		</div>
		<!-- 第五部分 -->
		<div class="five">
			<div class="top">
				<ul>
					<li style="margin-left:140px">首页</li>
					<li >|</li> 
					<li>关于我们</li> 
					<li >|</li> 
					<li >解决方案</li> 
					<li >|</li> 
					<li >技术服务</li> 
					<li >|</li> 
					<li>新闻中心</li>
					 <li>|</li>
					 <li>联系我们</li>
				</ul>
			</div>
			<div class="center">
				<p>联系我们</p>
				<p>信息科技有限公司</p>
				<p>Lnfomation Technology Co.,Ltd</p>
				<hr color="gray">
			</div>
			<div class="bot">
				<img src="@/assets/images/ft1.png" alt="">
				<img src="@/assets/images/ft2.png" alt="">
				<img src="@/assets/images/ft3.png" alt="">
				<ul>
					<li style="margin-left: 210px;">江苏省昆仑市</li>
					<li style="margin-left: 230px;">XXX@xxx.com</li>
					<li style="margin-left: 240px;">手机：XXXXXXXXXXX</li>
				</ul>
			</div>
		</div>
	</div>
</template>

<script>
	export default {
	  name: 'jiShu',
	  data () {
		  
	    return {
	        
	          }
	        }
	    }
	  
</script>

<style scoped>
	.box{
		width: 1900px;
		height: 4000px;
		margin:0 auto;
	
	}
	.one{
		width: 1900px;
		height: 200px;
		background-color: white;
			margin:0 auto;
	}
	.one a{
		color: gray;
	}
	.one ul{
		width: 1900px;
		height: 200px;
		list-style: none;
		text-align: center;
		line-height: 200px;
	}
	.one ul li{
		float: left;
		margin-right: 40px;
		font-size: 30px;
	}
	
	.two{
		width: 100%;
		height: 600px;
		/* display: flex; */
		flex-direction: row;
		margin-bottom: 5px;
		background-image: url('../assets/images/js_img.jpg');
		background-repeat: no-repeat;
		background-size: 100% 100%;
		
	}
	.two p{
		height: 200px;
		margin: -40px auto;
		text-align: center;
		line-height: 200px;
		font-size: 30px;
		color: black;
	}
	.three {
		width: 1900px;
		height: 1200px;
		margin: 20px auto;
	}
	.three .three-top{
		text-align: center;
	}
	.three .three-center{
		width: 1900px;
		margin: 0 auto;
		text-align: center;
	}
	.three .three-center .left{
		width: 1200px;
		height: 400px;
		float: left;
	}
	.three .three-center .left img{
		width: 1200px;
		height: 400px;
	}
	.three .three-center .right{
		float: right;
		width: 700px;
		text-align: center;
		line-height: 400px;
		height: 400px;
		background-color: gray;
	}
	.three .three-center-1{
		width: 1900px;
		margin: 0 auto;
		text-align: center;
	}
	.three .three-center-1 .right{
		float: right;
		width: 1200px;
		height: 400px;
	}
	.three .three-center-1 .right img{
		width: 1200px;
		height: 400px;
	}
	.three .three-center-1 .left{
		float: left;
		width: 700px;
		text-align: center;
		line-height: 400px;
		height: 400px;
		background-color: gray;
	}
	.three .three-center-2{
		width: 1900px;
		margin: 0 auto;
		text-align: center;
	}
	.three .three-center-2 .left{
		float: left;
		width: 1200px;
		height: 400px;
	}
	.three .three-center-2 .left img{
		width: 1200px;
		height: 400px;
	}
	.three .three-center-2 .right{
		float: right;
		width: 700px;
		text-align: center;
		line-height: 400px;
		height: 400px;
		background-color: gray;
	}
	.three .three-center-3{
		width: 1900px;
		margin: 0 auto;
		text-align: center;
	}
	.three .three-center-3 .right{
		float: right;
		width: 1200px;
		height: 400px;
	}
	.three .three-center-3 .right img{
		width: 1200px;
		height: 400px;
	}
	.three .three-center-3 .left{
		    float: left;
		    width: 700px;
		    text-align: center;
		    line-height: 400px;
		    height: 400px;
		    background-color: gray;
	}
	.three .three-center-4{
		width: 1900px;
		margin: 0 auto;
		text-align: center;
	}
	.three .three-center-4 .left{
		float: left;
		width: 1200px;
		height: 400px;
	}
	.three .three-center-4 .left img{
		width: 1200px;
		height: 400px;
	}
	.three .three-center-4 .right{
		float: right;
		width: 700px;
		text-align: center;
		line-height: 400px;
		height: 400px;
		background-color: gray;
	}
	
	.three .three-center-5{
		width: 1900px;
		margin: 0 auto;
		text-align: center;
	}
	.three .three-center-5 .right{
		float: right;
		width: 1200px;
		height: 400px;
	}
	.three .three-center-5 .right img{
		width: 1200px;
		height: 400px;
	}
	.three .three-center-5 .left{
		    float: left;
		    width: 700px;
		    text-align: center;
		    line-height: 400px;
		    height: 400px;
		    background-color: gray;
	}
	.four{
		width: 1900px;
		margin: 870px auto;
	}
	.four .four-bot{
		margin: 15px auto;
		font-size: 20px;
	}
	.four-bott img{
		width: 1900px;
		height: 100%;
	}
	
	.five{
		 
		 	width:100%;
		 	height: 800px;
		 	background-color: white;
			background-color: #000000;
			color: gray;
			margin-top: -875px;
	}
	.five .top{
		  width: 1500px;
		  height: 400px;
		  margin: 10px auto;
		  line-height: 400px;
	}
	.five .top ul{
		width: 1900px;
		/* height: 100px; */
		list-style: none;
		
	}
	.five .top  ul li{
		float: left;
		margin-right: 40px;
		font-size: 30px;
	} 
	.five .center{
		  width: 1500px;
		  height: 20px;
		  text-align: center;
		  margin: 0 auto;
	}
	.five .bot{
		  width: 1500px;
		  height: 20px;
		  text-align: center;
		  margin: 200px auto;
	} 
	.five .bot img{
		  margin-right: 300px;
	}
	.five .bot ul{
		  width: 1500px;
		  height: 20px;
		  text-align: center;
		  list-style: none;
		 
	} 
	.five .bot ul li{
		 
		  float: left;
	} 
</style>
